<template>
  <div class="container-header" slot="header">
    <Form class="search">
      <Row>
        <Col span="6">
          <FormItem label="月份选择">
            <DatePicker v-model="list.form.month" format='yyyy-MM' type="month" placeholder="选择月份"></DatePicker>
          </FormItem>
        </Col>
        <Col span="4">
          <FormItem label="审核状态">
            <Select v-model="list.form.auditStatus" clearable @on-change="onSearchBtnClick">
              <Option :value="0">待审核</Option>
              <Option :value="1">已审核</Option>
            </Select>
          </FormItem>
        </Col>
        <Col span="6">
          <FormItem label="省份">
            <AreaSelect v-model="province" :onlyProvince="true" />
          </FormItem>
        </Col>
        <Col span="8" class="flexL">
          <Button class="btn-search" type="primary" icon="ios-search" @click="onSearchBtnClick"></Button>
        </Col>
      </Row>
    </Form>
  </div>
</template>

<script>
  import { mapGetters } from 'vuex'
  import AreaSelect from '@/components/AreaSelect';

  export default {
    props: {
      list: {
        type: Object,
        default: ''
      }
    },
    computed: {
      ...mapGetters(['addressList']),
      province: {
        get() {
          return this.list.form.province
        },
        set(v) {
          let item = this.addressList.find(item => item.id === v) || {}
          this.list.form.provinceName = item.value
          this.list.form.province = v
        }
      }
    },
    data() {
      return {
        currValue: [],
        useTypeList: [
          { text: '是', value: true },
          { text: '否', value: false },
        ],
      }
    },
    components: {
      AreaSelect,
    },
    mounted() {
    },
    methods: {
      onSearchBtnClick() {
        this.$emit('onSearchBtnClick')
      },
      onAddBtnClick() {
        this.$emit('onAddBtnClick')
      },
    },
    watch: {
    }
  }
</script>
